{include file="common/header-top" /}

<style>
    .help-item-block{

    }
    .help-item-block .van-grid-item__content{
        background-color: #f9fcfa;
        padding: 4px 4px;
    }
    .help-item-block .van-grid-item__content .ven-cell{
        padding: 7px 15px;
    }

    .article {
        padding-left: 10px;
        padding-right: 10px;
        overflow: auto;
    }
    .article img {
        max-width: 100% !important;
    }

</style>


<div id='app' v-cloak>

    <van-nav-bar
            :title="pageInfo.title"
            left-arrow
            @click-right=""
            @click-left="goBack"
    >
    </van-nav-bar>



    <!--轮播-->
    <van-swipe :autoplay="1500" indicator-color="white" :height="180" v-show="showBanner">
        <van-swipe-item v-for="(item, index) in topBanner" :key="index" @click="swipeClick(item)">
            <van-image :src="item.logo" v-lazy="item.logo" :lazy-load="false"/>
        </van-swipe-item>
    </van-swipe>
    <!--轮播-->


    <van-divider :style="{borderColor: '#32a14a', padding: '0px', margin: '0px'}" v-show="showBanner"></van-divider>

    <van-row style="margin-bottom: 100px;">
        <van-col span="24">
            <section v-html="pageInfo.content" class="article">
            </section>
        </van-col>
    </van-row>


    {include file="common/foot-bar" /}

</div>





<script>
    var vm = new Vue({
        el: '#app',
        data() {
            return {
                active:3,
                userCenterIcon: {
                    normal: '/__FRONT__/images/icon/usercenter-n.png',
                    active: '/__FRONT__/images/icon/usercenter-a.png'
                },
                erShouIcon: {
                    normal: '/__FRONT__/images/icon/ershou-n.png',
                    active: '/__FRONT__/images/icon/ershou-a.png'
                },


                pageFlag: '{$pageFlag}',
                pageInfo: {},

                topBanner: [],

            }
        },

        created(){

            //广告banner接口数据
            axiosRequest.get('/api/common/bannerItems', {params:{locationId:4}}).then(function (response) {
                if (response.code == 200) {
                    vm.$data.topBanner = response.data;
                } else {
                    vant.Notify({ type: 'danger', message: response.msg });
                }
            });


            this.getSinglePage();

        },

        computed:{
            showBanner(){
                if (this.topBanner.length) {
                    return true;
                }
                return false;
            }

        },

        methods:{

            //返回上一页
            goBack(){
                history.back();
            },




            getSinglePage(){
                var params = {
                    pageFlag: this.pageFlag
                };
                axiosRequest.get('/api/news/singlePage',{params:params}).then(function (response) {
                    if (response.code == 200) {
                        vm.$data.pageInfo = response.data;
                    } else {
                        vant.Toast('系统开小差啦！');
                    }
                });
            },

        }
    });




</script>

{include file="common/foot-bottom" /}
